import React, { Component } from 'react'
import Header from '../../components/Header/Header'
import ListMenu from './ListMenu/ListMenu.jsx'
import ShopList from './ShopList/ShopList.jsx'
import "./Cate.less"
import { connect } from "react-redux";
import { bindActionCreators } from "redux";
import {actions,getListmenu,getShoplist,getN} from '../../store/modules/cate'
// import { reqgetcate, reqgetgoods } from '../../http/api'

 class Cate extends Component {
  componentDidMount(){
    let {
      cate:{reqListmenu}
    }=this.props;
    reqListmenu();
   
  }
  
  

  render() {
    let { listmenu, shoplist,cate:{changeLeft}, n } = this.props;
    return (
      <div className='cate'>
        <Header back title="分类"></Header>
        <div className='cate_list_menu'>
          {/* 左侧的菜单 */}
          <ListMenu
            listmenu={listmenu}
            n={n}
            onChangeN={n=>changeLeft(n)}
          ></ListMenu>
        </div>
        <div className='cate_shop_list'>
          {/* 右侧的商品展示区 */}
          <ShopList shoplist={shoplist}></ShopList>
        </div>
      </div>
    )
  }
}
const mapStateToProps = (state) => {
  return {
    listmenu:getListmenu(state),
    shoplist:getShoplist(state),
    n:getN(state)
  };
};
const mapDispatchToProps = (dispatch) => {
  return {
    cate: bindActionCreators(actions, dispatch),
  };
};




export default connect(mapStateToProps, mapDispatchToProps)(Cate);
